/*
 * @Author: tanying
 * @Date: 2024-04-25 11:02:49
 * @LastEditTime: 2024-04-25 11:37:51
 * @LastEditors: tanying
 * @FilePath: \vue-three\src\plugins\Walk.js
 * @Description: 漫游
 */
import * as THREE from 'three';
import { GLTFLoader } from 'three/addons/loaders/GLTFLoader.js';

export default class Walk {
   constructor(scene) {
    this.scene = scene;
    
    // 声明一个对象keyStates用来记录键盘事件状态
    const keyStates = {
      // 使用W、A、S、D按键来控制前、后、左、右运动
      // false表示没有按下，true表示按下状态
      W: false,
      A: false,
      S: false,
      D: false,
    };

    this.loadPerson()


    // 当某个键盘按下设置对应属性设置为true
    document.addEventListener('keydown', (event) => {
      if (event.code === 'KeyW') keyStates.W = true;
      if (event.code === 'KeyA') keyStates.A = true;
      if (event.code === 'KeyS') keyStates.S = true;
      if (event.code === 'KeyD') keyStates.D = true;
    });
    // 当某个键盘抬起设置对应属性设置为false
    document.addEventListener('keyup', (event) => {
      if (event.code === 'KeyW') keyStates.W = false;
      if (event.code === 'KeyA') keyStates.A = false;
      if (event.code === 'KeyS') keyStates.S = false;
      if (event.code === 'KeyD') keyStates.D = false;
    });
  }

  async loadPerson(params) {
    const loader = new GLTFLoader(); 
    const group = new THREE.Group();

    const gltf = await loader.loadAsync("./model/机器人.glb");
    const player = gltf.scene;//玩家角色模型
    group.add(player)

    //包含关键帧动画的模型作为参数创建一个播放器
    const mixer = new THREE.AnimationMixer(player);
    console.log('gltf.animations', gltf.animations);
    // gltf.animations包含做个动作，选择其中的步行动作
    const clipAction = mixer.clipAction(gltf.animations[13]);
    clipAction.play(); //播放动画

    this.scene.add(group);
  }
}


